<template>
  <DatePicker
    clearable
    :type="theDateType"
    :value="value"
    :format="theFormat"
    :placeholder="thePlaceholder"
    @on-change="handleChange"
    :style="theSetstyle">
  </DatePicker>
</template>

<script>
import { DatePicker } from 'iview'

export default {
  name: 'MyDatePick',
  components: {
    DatePicker
  },
  props: {
    dateType: {
      default: 'date',
      required: false,
      type: String
    },
    format: {
      default: 'yyyy-MM-dd',
      required: false,
      type: String
    },
    placeholder: {
      default: '选择日期',
      required: false,
      type: String
    },
    setstyle: {
      default: 'width: 200px;',
      required: false,
      type: String
    },
    value: {
      default: '',
      required: false,
      type: String
    }
  },
  data () {
    return {
      theDateType: 'date',
      theFormat: this.format,
      thePlaceholder: this.placeholder,
      theSetstyle: this.setstyle,
      theDate: this.value
    }
  },
  created () {
    // this.initDictData()
  },
  methods: {
    beforeUpload () {
    },
    handleChange (val) {
      this.$emit('change', this.theDate)
    }
  },
  watch: {
    value: function () {
      this.theDate = this.value
    }
  }
}
